<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>首页</title>
	<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" /> 
	<link rel="stylesheet" href="http://static-online.zhaogang.com/publicresource/css/CatUI.min.css">
	<link rel="stylesheet" href="../../Resources/mall2/css/list.css">
</head>
<body>
	<div id="mall_header">
		<div class="topbar">
			<div class="w1180">
				<div class="toplink">
					<a href=""><i class="home"></i>找钢首页</a>
					<span>喵，欢迎来找钢！</span>
					<a href="javascript:" id="btn_login">请登录</a>
					<a href="javascript:" id="btn_register">免费注册</a>
					<a href="javascript:" id="btn_quit" style="display:none;">退出</a>
					<a href="javascript:" style="display:none;">账户切换</a>
				</div>
				<div class="topmenu">
					<a href="">我的找钢</a>|<a href="">我的订单</a>|
					<div class="msn">
						<a href="#" class="msn_center">消息中心<span>5</span></a>
						<div class="msn_box">
							尚未认证企业<a href="#">去验证</a><br/>
							积分规则调整公告<a href="#">查看详情</a>
						</div>
					</div>
					|<a href="">积分商城</a>|<a href="">帮助中心</a>|<a href="">在线客服</a>|<span><i class="tel"></i>021-60100300 (8:30-17:30)</span>
				</div>
			</div>
		</div>
		<div class="header_box">
			<div class="w1180">
				<a href="" class="logo"></a>
				<ul class="nav">
					<li><a href="/">首页</a></li>
					<li class="on"><a href="" class="hot"><i class="icon_hot"></i>商城</a></li>
					<li><a href="">资源单</a></li>
					<li><a href="">找物流</a></li>
					<li><a href="">找加工</a></li>
					<li><a href="">白条</a></li>
					<li><a href="">行情</a></li>
				</ul>
				<div class="shopCar">
					<div class="default">
						<i class="icon_shopCar"></i>
						<i class="icon_shopCount">2</i>
						<a href="#">购物车</a>
					</div>
					<div class="shop_list">
						<div class="spacer"></div>
						<div class="shop_box">
							<div class="tit">找钢商城</div>
							<div class="mall">
								<ul class="listBox">
									<li>
										<div class="name">
											新抚顺 三级抗震螺纹钢
											<p class="type">HRB400E  28*9</p>
										</div>
										<div class="r">
											<div class="price">&yen;2560x2</div>
											<a href="javascript:void(0)" class="btn_remove"></a>
										</div>
									</li>
									<li>
										<div class="name">
											新抚顺 三级抗震螺纹钢
											<p class="type">HRB400E  28*9</p>
										</div>
										<div class="r">
											<div class="price">&yen;2560x2</div>
											<a href="javascript:void(0)" class="btn_remove"></a>
										</div>
									</li>
									<li>
										<div class="name">
											新抚顺 三级抗震螺纹钢
											<p class="type">HRB400E  28*9</p>
										</div>
										<div class="r">
											<div class="price">&yen;2560x2</div>
											<a href="javascript:void(0)" class="btn_remove"></a>
										</div>
									</li>
									<li>
										<div class="name">
											新抚顺 三级抗震螺纹钢
											<p class="type">HRB400E  28*9</p>
										</div>
										<div class="r">
											<div class="price">&yen;2560x2</div>
											<a href="javascript:void(0)" class="btn_remove"></a>
										</div>
									</li>
								</ul>
							</div>
							<div class="collect">
								<div class="txt">
									<span class="sum"><i class="num">&yen;37855.50</i></span>
									共<span class="num">1</span>件  <span class="num">2.174</span>吨
								</div>
								<a href="javascript:void(0)" class="btn_submit">去锁货</a>
								<div class="other">
									<a href="#">去看看</a>
									积分商城有<span class="num">14</span>件商品等待兑换
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>

	<div class="subnav">
		<a class="subnav_verfast" href="###">极速版</a>
		<div class="subnav_tab">
			<a href="###" class="current"><span>全部</span></a>
			<a href="###"><span>热卷</span></a>
			<a href="###"><span>建材</span></a>
			<a href="###"><span>中厚板</span></a>
			<a href="###"><span>冷轧涂镀</span></a>
		</div>
	</div>

	<div class="container">
		<div class="mainbox">
			<ul class="searchbox">
							<li>
								<select><option value="全国">全国</option><option value="南京市">南京市</option><option value="杭州市">杭州市</option><option value="石家庄市">石家庄市</option><option value="上海市">上海市</option></select>
								<span>规格</span>
								<div class="searchbox_option">
									<input type="text" />
									<ul>
										<li title="冷轧卷">冷轧卷</li>
										<li title="冷轧卷">冷轧卷冷轧卷冷轧卷冷轧卷</li>
										<li title="冷轧卷">冷轧卷</li>
										<li title="冷轧卷">冷轧卷</li>
										<li title="冷轧卷">冷轧卷</li>
										<li title="冷轧卷">冷轧卷</li>
										<li title="冷轧卷">冷轧卷</li>
										<li title="冷轧卷">冷轧卷</li>
										<li title="冷轧卷">冷轧卷</li>
										<li title="冷轧卷">冷轧卷</li>
										<li title="冷轧卷">冷轧卷</li>
										<li title="冷轧卷">冷轧卷</li>
									</ul>
								</div>
								<span>材质</span>
								<div class="searchbox_option">
									<input type="text" />
									<ul>
										<li title="冷轧卷">冷轧卷</li>
										<li title="冷轧卷">冷轧卷</li>
									</ul>
								</div>
								<span>钢厂</span>
								<div class="searchbox_option">
									<input type="text" />
									<ul>
										<li title="冷轧卷">冷轧卷</li>
										<li title="冷轧卷">冷轧卷</li>
									</ul>
								</div>
								<span>品名</span>
								<div class="searchbox_option">
									<input type="text" />
									<ul>
										<li title="冷轧卷">冷轧卷</li>
										<li title="冷轧卷">冷轧卷</li>
									</ul>
								</div>
								<span>仓库</span>
								<div class="searchbox_option">
									<input type="text" />
									<ul>
										<li title="冷轧卷">冷轧卷</li>
										<li title="冷轧卷">冷轧卷</li>
									</ul>
								</div>
								<button class="btnsearch">找货</button>
							</li>
							<li class="searchbox_sub">
								<span>厚度/直径</span><input type="text" />-<input type="text" style="margin-right:16px;"/>
								<span>宽度</span><input type="text" />-<input type="text" style="margin-right:16px;"/>
								<span>长度</span><input type="text" />-<input type="text" style="margin-right:16px;"/>
								<label><input type="checkbox">只看商城</label>
							</li>
						</ul>
			<table width="100%" class="listbox">
				<thead>
					<tr>
						<th>钢厂<i class="i_rise"></i></th>
						<th>品名<i class="i_drop"></i></th>
						<th>材质<i class="i_drop"></i></th>
						<th>规格<i class="i_drop"></i></th>
						<th>仓库（地区）<i class="i_drop"></i></th>
						<th>可供量</th>
						<th>单价<i class="i_drop"></i></th>
						<th>供应商</th>
						<th>操作</th>
					</tr>
				</thead>
				<tbody>
					<tr>
	          <td>本钢</td>
	          <td>四切普板</td>
	          <td>Q345B</td>
	          <td>4.75*1250*25041</td>
	          <td class="f12">培训1号库(上海)</td>
	          <td class="f12">16件/19.50吨</td>
	          <td class="red"><b>400</b></td>
	          <td>找钢商城</td>
	          <td><a href="###" class="btn_buy">选购</a></td>
	        </tr>
				</tbody>
				<tbody class="listinfo_on">
					<tr>
	          <td>本钢</td>
	          <td>三级抗震螺纹钢</td>
	          <td>HRB400E</td>
	          <td>28*12</td>
	          <td class="f12">培训1号库(上海)</td>
	          <td class="f12">13件/109.84吨</td>
	          <td class="red"><b>400</b></td>
	          <td>找钢商城</td>
	          <td><a href="###" class="btn_buy">选购<i class="i_up"></i></a></td>
	        </tr>
	        <tr class="listinfo_wrap">
	        	<td colspan="10">
	        		<div class="listinfo">
	        		<i class="listinfo_arrow"></i>
	        			<table width="100%">
	        				<thead>
	        					<tr>
											<th>产品名称</th>
											<th>货物所在地</th>
											<th>仓库</th>
											<th><span>件重</span><i class="i_drop"></i></th>
											<th width="64">&nbsp;</th>
										</tr>
	        				</thead>
									<tbody>
										<tr>
											<td>东华 三级抗震螺纹钢 HRB400E 28*12</td>
											<td>上海</td>
											<td>培训1号库</td>
											<td>2.898吨</td>
											<td><a href="###" class="btn_choose">选购</a></td>
										</tr>
										<tr>
											<td>东华 三级抗震螺纹钢 HRB400E 28*12</td>
											<td>上海</td><td>培训1号库</td>
											<td>2.898吨</td>
											<td><a href="###" class="btn_disable">已加入</a></td>
										</tr>
										<tr>
											<td>东华 三级抗震螺纹钢 HRB400E 28*12</td>
											<td>上海</td>
											<td>培训1号库</td>
											<td>2.898吨</td>
											<td><a href="###" class="btn_choose">选购</a></td>
										</tr>
									</tbody>
									<tfoot>
										<tr>
											<td colspan="5" class="checkmore">点击加载更多</td>
										</tr>
									</tfoot>
	        			</table>
	        		</div>
	        	</td>
	        </tr>
				</tbody>
				<tbody>
					<tr>
	          <td>本钢</td>
	          <td>四切普板</td>
	          <td>Q345B</td>
	          <td>4.75*1250*25041</td>
	          <td class="f12">培训1号库(上海)</td>
	          <td class="f12">16件/19.50吨</td>
	          <td class="red"><b>400</b></td>
	          <td class="supplier_show">上海昌敬</td>
	          <td><a href="###" class="btn_disable">待开盘</a></td>
	        </tr>
				</tbody>
			</table>
			<div class="logintips">
				<a href="###">登录</a>&nbsp;即可免费查看更多现货资源。<a href="###" class="logintips_link">点击这里 免费注册</a>
			</div>
			<div class="pkg_page clearfix">
	  		<a href="javascript:" class="up up_nocurrent">上一页</a>
	  		<a href="javascript:" class="current">1</a>
	  		<a href="javascript:">2</a>
	  		<a href="javascript:">3</a>
	  		<a href="javascript:">4</a>
	  		<span class="pkg_page_ellipsis">...</span>
	  		<a href="javascript:">99</a>
	  		<a href="javascript:" class="down">下一页</a>
	  		<span class="pkg_pagevalue">
	  			到<input type="text" id="iptPageTxt" class="pkg_page_num">页<a href="javascript:" class="pkg_page_submit">确定</a>
	  		</span>
	  	</div>
		</div>

		<div class="sidebox">
			<div class="sidebox_tab">
				<span>锁货列表</span>
				<span class="active">待处理</span>
			</div>
			<div class="sidebox_cnt">
				<div class="tabcnt">
					<p class="sidebox_cnt_tips"><a href="###">登录</a>&nbsp;并查看更多货物</p>
				</div>
				<div class="tabcnt active">
					<ul class="buylist">
						<li>
							<div class="buylist_cnt">
								<p><strong>本钢&nbsp;冷轧卷</strong><span></span></p>
								<p>Q398B 50*3000*800</p>
								<p><span class="highlight">杭州市</span>&nbsp;/&nbsp;三号仓&nbsp;/&nbsp;0.942吨</p>
							</div>
							<div class="buylist_option">
								<p><strong>400</strong></p>
								<input type="text" value="1">
								<a href="###" class="buylist_option_del">删除</a>
								<div class="buylist_option_delbox">
									<a href="###" class="cancel">取消</a>
									<a href="###" class="delete">删除</a>
								</div>
							</div>
						</li>
						<li>
							<div class="buylist_cnt">
								<p><strong>本钢&nbsp;冷轧卷</strong></p>
								<p>Q398B 50*3000*800Q398B 50*300000*800Q398B 50*3000*800</p>
								<p><span class="highlight">杭州市</span>&nbsp;/&nbsp;三号仓&nbsp;/&nbsp;0.942吨</p>
							</div>
							<div class="buylist_option">
								<p><strong>123456</strong></p>
								<input type="text" value="1" disabled="disabled">
								<a href="###" class="buylist_option_del">删除</a>
								<div class="buylist_option_delbox">
									<a href="###" class="cancel">取消</a>
									<a href="###" class="delete">删除</a>
								</div>
							</div>
						</li>
					</ul>
					<div class="buyempty">清空所有货物</div>
					<div class="buyinfo">
						<p>抬&nbsp;&nbsp;头：个人用户无法锁货，请<a href="###">创建企业账号</a></p>
						<p>
							<select>
								<option value="暂无交易员">暂无交易员</option>
								<option value="某某某">某某某</option>
							</select>
							<a href="###" class="add">新增</a>
						</p>
					</div>
					<div class="buytotal">
						<span>共计<strong>3</strong>件</span>
						<span><strong>1.855</strong>吨</span>
						<span><strong>18878.30</strong>元</span>
					</div>
					<button class="btnbuy">立即锁货</button>
				</div>
			</div>
		</div>
	</div>

	<div id="mall_footer">
		<div class="advantage">
			<ul class="w1180">
				<li><i class="ad1"></i>免费找货找车</li>
				<li><i class="ad2"></i>商城钢厂直供</li>
				<li><i class="ad3"></i>品种规格齐全</li>
				<li><i class="ad4"></i>仓储加工一体</li>
				<li><i class="ad5"></i>缺钱可打白条</li>
			</ul>
		</div>

		<ul class="help_link w1180">
			<li>
				<dl>
					<dd><a href="" target="_blank">我是买家，如何找货</a></dd>
					<dd><a href="" target="_blank">资源单找货</a></dd>
					<dd><a href="" target="_blank">我是买家，如何找车</a></dd>
					<dd><a href="" target="_blank">添加胖猫物流APP</a></dd>
				</dl>
			</li>
			<li>
				<dl>
					<dd><a href="" target="_blank">商城钢厂直供</a></dd>
					<dd><a href="" target="_blank">商城采购流程</a></dd>
					<dd><a href="" target="_blank">合作钢厂</a></dd>
					<dd><a href="" target="_blank">售后政策</a></dd>
					<dd><a href="" target="_blank">退换流程</a></dd>
				</dl>
			</li>
			<li>
				<dl>
					<dd><a href="" target="_blank">品类规格齐全</a></dd>
					<dd><a href="" target="_blank">自营现货</a></dd>
					<dd><a href="" target="_blank">第三方资源</a></dd>
					<dd><a href="" target="_blank">实行行情</a></dd>
				</dl>
			</li>
			<li>
				<dl>
					<dd><a href="" target="_blank">仓储加工一体化</a></dd>
					<dd><a href="" target="_blank">胖猫加工简介</a></dd>
				</dl>
			</li>
			<li>
				<dl>
					<dd><a href="" target="_blank">缺钱可打白条</a></dd>
					<dd><a href="" target="_blank">胖猫白条简介</a></dd>
					<dd><a href="" target="_blank">胖猫白条申请流程</a></dd>
					<dd><a href="" target="_blank">如何使用胖猫白条</a></dd>
					<dd><a href="" target="_blank">胖猫白条如何还款</a></dd>
				</dl>
			</li>
		</ul>

		<div class="copyright">
			<div class="link">
				<a href="" target="_blank">关于我们</a>
				| <a href="" target="_blank">法律声明</a>
				| <a href="" target="_blank">诚聘英才</a>
				| <a href="" target="_blank">联系我们</a>
				| <a href="" target="_blank">友情链接</a>
				| <a href="" target="_blank">常见问题</a>
			</div>
			<p>COPYRIGHT &copy; 找钢网 www.zhaogang.com 沪ICP备 13013915号-3 ICP证：沪B2-20140148</p>
			<p class="honor">
				<span>商务部2015-2016年度电子商务示范企业</span>
				<span>2015德勤--华兴高科技高成长50强明日之星</span>
				<span>中国互联网诚信示范企业</span>
				<span>2015年中国大宗商品现代流通诚信市场</span>
			</p>
			<div class="copyimg">
				<span class="img1"></span>
				<span class="img2"></span>
				<a href="http://www.itrust.org.cn/home/index/itrust_certifi?wm=1591692730" class="img4" target="_blank"></a>
				<a href="http://www.shjbzx.cn/" class="img5" target="_blank"></a>
				<a href="" class="img3"></a>
				<a href="" class="img6"></a>
			</div>
		</div>
	</div>


	<!--------send验证码---------->
	<div class="phone-test">
		<a href="javascript:void(0)" class="close">×</a>
		<h3>请验证您的手机号</h3>
		<div class="test-note">
			<p class="note1">验证手机有助于您及时收到短信提醒，跟踪您的订单情况</p>
			<p class="note3">
				<span class="note-name">手机：</span>
				<span class="note-num">15671556649</span>
			</p>
			<p class="note2"><button id="sendma" class="sendma">获取短信验证码</button></p>
			<p class="note3">
				<span class="note-name">验证码：</span>
				<span class="note-num"><input type="text"></span>
			</p>
			<p class="note2"><button class="note-sure">确定</button></p>
			<p class="note4">若长时间未收到验证码，请致电客服热线寻求帮助021-35906666</p>
		</div>
	</div>

	<script src="http://static-online.zhaogang.com/publicresource/js/jquery.min.js"></script>
	<script src="http://static-online.zhaogang.com/publicresource/js/CatUI.min.js"></script>
	<script src="http://static-online.zhaogang.com/publicresource/control/layer/layer.min.js"></script>
	<script>
	//回到顶部
		var gotop = new goTop();
	//搜索弹出列表
	$('.searchbox_option').mouseover(function() {
		$(this).find('ul').show();
	});
	$('.searchbox_option').mouseout(function() {
		$(this).find('ul').hide();
	});
	//tab
	$('body').on('click','.sidebox_tab span',function(){
		var _index = $(this).index();
		$(this).addClass('active').siblings().removeClass('active');
		$(this).parents('.sidebox').find('.tabcnt').eq(_index).addClass('active').siblings().removeClass('active');
	})

	//锁货删除
	$('.buylist_option_del').click(function() {
		$(this).siblings('.buylist_option_delbox').show();
	});
	$('.buylist_option .delete,.buylist_option .cancel').click(function() {
		$('.buylist_option_delbox').hide();
	});
	//新增弹层
	$('.buyinfo .add').click(function(){
		var popupAdd = new CatPopup({
			template: '<div class="poplockadd"><div class="poplockadd_title">新增交易员</div><div>交易员姓名或工号：<input type="text"/></div></div><div class="poplockadd_btn"><button class="btn_confirm">确定</button></div>'
		});
	})

	//立即锁货弹层
	$('.btnbuy').click(function(){
		var popupAdd = new CatPopup({
			template: '<div class="popwarn"><i class="icon_heedmid"></i><div class="popwarn_title">无法在线交易</div><div class="popwarn_tips">您好，个人用户无法在线交易，如需在线交易请使用企业用户。</div><div class="popwarn_btn"><button class="btn_confirm">确定</button><button class="btn_cancel">取消</button></div></div>'
		});
	})
	//排序图标
	$('.listbox th').click(function() {
		var sorticon = $(this).find('i');
		if (sorticon.hasClass('i_rise')) {
			$('.listbox th').find('i').removeClass('active')
			sorticon.removeClass('i_rise').addClass('i_drop active');
		} else {
			$('.listbox th').find('i').removeClass('active')
			sorticon.removeClass('i_drop').addClass('i_rise active');
		}
	});
	//展开列表详情
	$('.btn_buy').click(function() {
		var buyicon = $(this).find('i');
		if (buyicon.hasClass('i_down')) {
			buyicon.removeClass('i_down').addClass('i_up');
		} else {
			buyicon.removeClass('i_up').addClass('i_down');
		}

		$(this).parents('tbody').toggleClass('listinfo_on');
	});
	//供应商提示
  $('.supplier_show').mouseTips({
    titleInfo:'<div class="mousetip_tit">上海昌敬实业有限公司</div><ul class="mousetip_list"><li><span>王先生</span>13800138000</li><li><span>小李</span>13800138000</li><li><span>陈先生</span>13800138000</li></ul>',
    position:'top',
    borderColor:'#fff',
    fontColor:'#333'
  });


  ////send 验证
    var sendma=$('#sendma');
		$(document).on("ready", function () {
		    layer.open({
		        type: 1,
		        shade: 0.5,
		        skin: 'demo-class', //加上边框
		        title: false,
		        closeBtn:0,
		        area: ['500px', 'auto'],
		        content: $('.phone-test')
		    })
		});
		$(".close").on("click",function(){
		    layer.closeAll();
		});
		//发送验证码

		    sendma.on('click',function(){
		        $(this).removeClass('sendma').html('重新发送(<span>59</span>)').attr({'disabled':'disabled'});
		            var aa=59;
		            var timer=setInterval(function(){
		                aa--;
		                sendma.html('重新发送(<span>'+aa+'</span>)');
		                if(aa<=0){
		                    clearInterval(timer);
		                    sendma.addClass('sendma').html('重新发送').removeAttr('disabled');
		                }
		            },1000)
		    })

	</script>

</body>
</html>